<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户界面</title>
    <link rel="stylesheet" href="./index_2.css">
    <link rel="stylesheet" href="./index_1.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css">
</head>

<body>
    <div class="w">
        <!-- 头部导航区start -->
        <nav class="navbar clearfix">
            <div class="fl">
                <a href="#"><i class="bi-list"></i></a>
            </div>
            <div class="fr">
                <a href="#"><i class="bi-lightbulb-fill"></i></a>
                <a href="#"><i class="bi-arrows-fullscreen"></i></a>
                <a href="#"><i class="bi-volume-up"></i></a>
                <a href="#"><i class="bi-question-circle"></i></a>
                <a href="#">多语言<i class="bi-chevron-down"></i> </a>
                <a href="#" id="tx">
                    <div class="tx"> </div> 刘先生
                </a>
            </div>
            <!-- .tx  头像-->
        </nav>
        <!-- 头部导航区end -->


        <!-- 功能的导航区start -->
        <nav class="usebar w clearfix">
            <button>充值清零</button>
        </nav>
        <!-- 功能的导航区end -->
        <!-- input输入查询区start-->
        <form class="querybar w">
            <input type="text" placeholder="设备编号">
            <input type="text" placeholder="设备名称">
            <input type="text" placeholder="账号">
            <input type="text" placeholder="区域信息">
            <label><input type="checkbox" name="jf" />
                是否催缴
            </label>
            <button>查询</button>
            <p>注："找补"功能是在用户电表损坏情况下更换电表补充原剩下金额但不新增账单</p>
        </form>
        <!-- input输入查询区end -->
    </div>
    <!-- 表格start -->
    <div class="w">
        <table valign="middle" cellspacing="0px" cellpadding="0px">
            <thead align="center">
                <tr>
                    <td><input type="checkbox"></td>
                    <td>设备编号</td>
                    <td>安装位置</td>
                    <td>账号</td>
                    <td>设备类型</td>
                    <td>状态</td>
                    <td>电费状态</td>
                    <td>剩余电费</td>
                    <td>计费类型</td>
                    <td>操作</td>
                </tr>
            </thead>
            <tbody align="center">
                <tr>
                    <td><input type="checkbox" name="1"> </td>
                    <td>JH201</td>
                    <td>江海楼201宿舍</td>
                    <td>201宿舍</td>
                    <td>Wifi/4G单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>8.92</td>
                    <td>表内预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:8.92元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="2"></td>
                    <td>JH202</td>
                    <td>江海楼202宿舍</td>
                    <td>202宿舍</td>
                    <td>Wifi/4G单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>16. 39</td>
                    <td>表内预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:16. 39元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="3"></td>
                    <td>JH203</td>
                    <td>江海楼203宿舍</td>
                    <td>203宿舍</td>
                    <td>Wifi/4G单相电表</td>
                    <td>在线</td>
                    <td>欠费</td>
                    <td>-3. 18</td>
                    <td>表内预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("当前用户无可退费用");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="4"></td>
                    <td>JH204</td>
                    <td>江海楼204宿舍</td>
                    <td>204宿舍</td>
                    <td>Wifi/4G单相电表</td>
                    <td>在线</td>
                    <td>欠费</td>
                    <td>-4.57</td>
                    <td>表内预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("当前用户无可退费用");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="5"></td>
                    <td>JH205</td>
                    <td>江海楼205宿舍</td>
                    <td>205宿舍</td>
                    <td>Wifi/4G单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>65.31</td>
                    <td>表内预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:65.31元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="6"></td>
                    <td>JH206</td>
                    <td>江海楼206宿舍</td>
                    <td>206宿舍</td>
                    <td>Wifi/4G单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>55.68</td>
                    <td>表内预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:55.68元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="7"></td>
                    <td>JH207</td>
                    <td>江海楼207宿舍</td>
                    <td>207宿舍</td>
                    <td>Wifi/4G单相电表</td>
                    <td>在线</td>
                    <td>欠费</td>
                    <td>-2.57</td>
                    <td>表内预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("当前用户无可退费用");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="8"></td>
                    <td>JH208</td>
                    <td>江海楼208宿舍</td>
                    <td>208宿舍</td>
                    <td>Wifi/4G单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>18.92</td>
                    <td>表内预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:18.92元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="9"></td>
                    <td>JH209</td>
                    <td>江海楼209宿舍</td>
                    <td>209宿舍</td>
                    <td>Wifi/4G单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>34.78</td>
                    <td>表内预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:34.78元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="10"></td>
                    <td>JH210</td>
                    <td>江海楼210宿舍</td>
                    <td>210宿舍</td>
                    <td>Wifi/4G单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>56.07</td>
                    <td>表内预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:56.07元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="11"></td>
                    <td>JH211</td>
                    <td>江海楼211宿舍</td>
                    <td>211宿舍</td>
                    <td>Wifi/4G单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>31.43</td>
                    <td>表内预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:31.43元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="12"></td>
                    <td>JH212</td>
                    <td>江海楼212宿舍</td>
                    <td>212宿舍</td>
                    <td>Wifi/4G单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>8.92</td>
                    <td>表内预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:8.92元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="13"></td>
                    <td>JH213</td>
                    <td>江海楼213宿舍</td>
                    <td>213宿舍</td>
                    <td>Wifi/4G单相电表</td>
                    <td>离线</td>
                    <td></td>
                    <td>16.39</td>
                    <td>表内预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:16.39元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="14"></td>
                    <td>JH214</td>
                    <td>江海楼214宿舍</td>
                    <td>214宿舍</td>
                    <td>Wifi/4G单相电表</td>
                    <td>在线</td>
                    <td>欠费</td>
                    <td>-3.18</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("当前用户无可退费用");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="15"></td>
                    <td>MD301</td>
                    <td>明德楼配电室</td>
                    <td>301宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td>欠费</td>
                    <td>-4.57</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("当前用户无可退费用");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="16"></td>
                    <td>MD302</td>
                    <td>明德楼配电室</td>
                    <td>302宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>65.31</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:65.31元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="17"></td>
                    <td>MD303</td>
                    <td>明德楼配电室</td>
                    <td>303宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>55.68</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:55.68元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="18"></td>
                    <td>MD304</td>
                    <td>明德楼配电室</td>
                    <td>304宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td>欠费</td>
                    <td>-2.57</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("当前用户无可退费用");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="19"></td>
                    <td>MD305</td>
                    <td>明德楼配电室</td>
                    <td>305宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>18.92</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:18.92元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="20"></td>
                    <td>MD306</td>
                    <td>明德楼配电室</td>
                    <td>306宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>34.87</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:34.87元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="21"></td>
                    <td>MD307</td>
                    <td>明德楼配电室</td>
                    <td>307宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>56.07</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:56.07元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="22"></td>
                    <td>MD308</td>
                    <td>明德楼配电室</td>
                    <td>308宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>31.43</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:31.43元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="23"></td>
                    <td>MD309</td>
                    <td>明德楼配电室</td>
                    <td>309宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>5.68</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:5.68元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="24"></td>
                    <td>MD310</td>
                    <td>明德楼配电室</td>
                    <td>310宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>16.39</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:16.39元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="25"></td>
                    <td>MD311</td>
                    <td>明德楼配电室</td>
                    <td>311宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td>欠费</td>
                    <td>-3.18</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("当前用户无可退费用");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="26"></td>
                    <td>MD312</td>
                    <td>明德楼配电室</td>
                    <td>312宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td>欠费</td>
                    <td>-4.57</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("当前用户无可退费用");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="27"></td>
                    <td>MD313</td>
                    <td>明德楼配电室</td>
                    <td>313宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>65.31</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:65.31元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="28"></td>
                    <td>MD314</td>
                    <td>明德楼配电室</td>
                    <td>314宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>55.68</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:55.68元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="29"></td>
                    <td>MD315</td>
                    <td>明德楼配电室</td>
                    <td>315宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td>欠费</td>
                    <td>-2.57</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("当前用户无可退费用");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <tr>
                    <td><input type="checkbox" name="30"></td>
                    <td>MD316</td>
                    <td>明德楼配电室</td>
                    <td>316宿舍</td>
                    <td>485单相电表</td>
                    <td>在线</td>
                    <td></td>
                    <td>18.92</td>
                    <td>系统预付费</td>
                    <td>
                        <a href="recharge.html">充值</a>
                        <a href="#" onclick='return confirm("确定将该设备剩余金额清零吗?剩余金额为:18.92元");'>
                            <font color="blue">清零退费</font>
                        </a>
                    </td>
                </tr>
                <!-- ...... -->
            </tbody>
        </table>
    </div>
    <!-- 表格end -->
</body>

</html>